<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <title>OA数字化办公平台</title>
    <meta content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" name="viewport" />
    
    <link rel="stylesheet" href="../../../ui/css/main/theme3/fontawesome5.min.css">
    <script charset="utf-8" src="/lib/jQuery-File-Upload-master/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script src="../../lib/mui/mui/mui.min.js" type="text/javascript"></script>
    <script src="../../js/base/base.js" type="text/javascript"></script>

    <link href="../../lib/mui/mui/mui.css" rel="stylesheet">
    <script type="text/javascript">
        mui.init({
        });
    </script>
    <style type="text/css">
        input[type=search]{
            background-color: #fff;
        }
        .mui-search{
            width: 93%;
            margin: 0 auto;
            /*margin-top: 50px;*/
            height:40px;
        }
        .mui-input-row{
            margin-top: 3px;
            z-index:10;
        }
        /*头部div样式*/
        .top-div-button{
            height:77px;
            width:25%;
            /*padding-top: 12px;*/
            float:left;
            background-color:#fafafa;
            text-align: center;
            cursor:pointer;
        }
        /*头部div点击样式*/
        .top-div-button:active {
            background-color:#fafafa;
        }
        /*头部div点击后的样式*/
        .top-div-button-visited {
            border-bottom:3px;
            border-bottom-color:#1888ff;
            border-bottom-style:solid;
        }
        /*头部角标样式*/
        .top-div-corner{
            position: absolute;
            right: -2px;
            top: 13px;
            padding: 0 0 0 0px;
            font-size: 12px;
            line-height: 20px;
            color:
                    #fff;
            background-color:
                    red;
            width: 20px;
            height: 20px;
            border-radius: 100%;
            text-align: center;
        }
        /*头部图片样式*/
        .top-img{
            width:38px;
            padding-top: 12px;
        }
        /*头部标题文本样式*/
        .top-div-text{
            height: 42px;
            font-size:12px;
        }
        /*标题超出页面宽度后变为省略号*/
        .mui-navigate-right div:nth-child(3){
            white-space:nowrap;
            overflow:hidden;
            text-overflow:ellipsis;
        }
       
    </style>
</head>

<body style="background-color:#fff;">

<!--
<div class="mui-card-content ">
<ul class="mui-table-view mui-grid-view" >
<li  class="mui-table-view-cell mui-media mui-col-xs-3" onclick="workflowListChange('1')">
<span class="mui-badge mui-badge-danger" style="display: none">2</span>
<a  id="wait" class="mui-table-view-cell" >
<img class="mui-media-object"  src="/img/assets/daiban.png" >
<div class="mui-media-body " style="height: 15px;margin-top: 4px">待办工作</div>
</a>
</li>
<li class="mui-table-view-cell mui-media mui-col-xs-3" onclick="workflowListChange('5')">
<a id="Launch" class="mui-table-view-cell">
<img class="mui-media-object"  src="/img/assets/gongwen.png">
<div class="mui-media-body " style="height: 15px;margin-top: 4px">待办公文</div>

</a>
</li>
<li class="mui-table-view-cell mui-media mui-col-xs-3" onclick="workflowListChange('4')">
<a id="trun" class="mui-table-view-cell" >
<img class="mui-media-object"  src="/img/assets/yiban.png">
<div class="mui-media-body" style="height: 15px;margin-top: 4px">已办工作</div>
</a>
</li>-->
<!--onclick="jumpsrc('/workflow/work/workflowIndexh5?dataType='+check($.GetRequest().dataType)+'')"-->
<!--onclick="jumpsrc('/workflow/work/workflowIndexh5?dataType=')"-->
<!--<li class="mui-table-view-cell mui-media mui-col-xs-3" onclick="jumpsrc('/workflow/work/workflowIndexh5?dataType='+check($.GetRequest().dataType)+'')">
<a id="End" class="mui-table-view-cell" >
<img class="mui-media-object"  src="/img/assets/xinjian.png">
<div class="mui-media-body" style="height: 15px;margin-top: 4px">新建工作</div>
</a>
</li>
</ul>
</div>
-->
<div style="width:100%;background-color:#fff;z-index: 999;position: fixed;bottom: 0px;float:left" >

    <div class="top-div-button" id="top-div-button-5"  onclick="workflowListChange('5')">
        <div style="width:60px;position:relative;margin:0 auto">
            <div class="top-div-corner" id="corner-5" style="display:none">99+</div>
            <img class="top-img"  src="/img/assets/gongwen.png" >
        </div>
        <div class="top-div-text"  >待办公文</div>
    </div>
    <div class="top-div-button" id="top-div-button-1"  onclick="workflowListChange('1')">
        <div style="width:60px;position:relative;margin:0 auto">
            <div class="top-div-corner" id="corner-1" style="display:none">99+</div>
            <img class="top-img"  src="/img/assets/daiban0514.png" >
        </div>
        <div class="top-div-text"  >待办工作</div>
    </div>

    <div class="top-div-button" id="top-div-button-4" onclick="workflowListChange('4')">
        <img class="top-img"  src="/img/assets/yiban0514.png" >
        <div class="top-div-text"  >已办工作</div>
    </div>

    <div class="top-div-button"  onclick="jumpsrc('/workflow/work/workflowIndexh5?dataType='+check($.GetRequest().dataType)+'')">
        <img class="top-img"  src="/img/assets/xinjian0514.png" >
        <div class="top-div-text"  >新建工作</div>
    </div>
</div>


<div class="mui-input-row mui-search" style="width:100%;background-color:#fff;height:20px;z-index:-10;display:none;" >
    <input  class="mui-input-clear"  id="searchLog" placeholder="" style="width:100%;background-color:#fff;display:none">
</div>

<!--<div id="refreshContainer" class="mui-content mui-scroll-wrapper" style="margin-top:100px;">-->
<div class="mui-content mui-scroll-wrapper" id="refreshContainer" style="float:left;background:
#fff;bottom: 77px;">

    <div class="mui-scroll" style="margin-top:0px;">
        <!--数据列表-->
        <ul class="mui-table-view mui-table-view-chevron list-ex" id="testUl"></ul>
    </div>
</div>


</body>

</html>
<script type="text/javascript">

    function GetQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
    }
    var flag_type="";
    flag_type = GetQueryString("flag"); //括号里放地址栏传参变量
    if(flag_type==""||flag_type==null){
        flag_type=5;
    }
    $(".top-div-button").removeClass("top-div-button-visited");
    $("#top-div-button-"+flag_type).addClass("top-div-button-visited");
    var type_url ="";
    if(flag_type == 1){
        type_url = "/workflow/work/selectWork";
        //type_url = "/workflow/work/selectEndWord";
        //$('title').html('待办工作');
    }else if(flag_type==2){
        type_url = "/workflow/work/selectAll"
    }else if(flag_type==4){
        type_url = "/workflow/work/selectEndWord";
        //$('title').html('已办工作');
    }else if(flag_type==5){
        type_url = "/document/selWillDocSendOrReceive";
        //$('title').html('待办公文');
    }

    var pageSize=10;
    var counter = 1;//计数器
    var pageStart = 0;//开始数据条数
    var dataNum;
    mui.init({
        pullRefresh : {
            container:refreshContainer,//待刷新区域标识，querySelector能定位的css选择器均可，比如：id、.class等
            up : {
                height:50,//可选.默认50.触发上拉加载拖动距离
                auto:true,//可选,默认false.自动上拉加载一次
                contentrefresh : "加载中...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
                contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
                callback: pullupRefresh
            }
        }
    });
    var sum=0;
    function data(add,sum,type_url){

        var data;
        if(flag_type==5){
            data = {
                "page":sum,
                "pageSize":15,
                "useFlag":true,
                "title":'' //搜索的内容
                //"title":$("#searchLog").val() //搜索的内容
            };
        }else{
            data = {
                "page":sum,
                "pageSize":15,
                "useFlag":true,
                "keyword":'' //搜索的内容
            };
        }
        $.ajax({
            type: 'get',
            url: type_url,
            dataType: 'json',
            data: data,
            success: function(res) {
                var data;
                if(flag_type==5){
                    data=res.datas;
                }else{
                    data=res.obj;
                }
                var li_inner='';
                //<li class="nothing mui-table-view-cell">没有更多数据了</li>
                var li_inner1='';
                if(data.length>0){

                    if(flag_type==5){
                        for(var i=0;i<data.length;i++){//增加数据
                            var user_photo="";
                            if (data[i].avatar != 0 && data[i].avatar != 1 && data[i].avatar != '') {
                                user_photo = '/img/user/' + data[i].avatar;
                            } else {
                                if (data[i].sex == 1) {
                                    user_photo = '/img/user/girl.png';
                                }else{
                                    user_photo = '/img/user/boy.png';
                                }
                            }

                            li_inner+='<li class="pin mui-table-view-cell"opflag="'+data[i].opFlag+'" flowId="'+data[i].flowId+'" tabId="'+data[i].id+'"  tableName="'+data[i].tableName+'" prcsId="'+data[i].realPrcsId+'" flowStep="'+data[i].step+'"  runId="'+data[i].runId+'"><a  href="javascript:;" class="mui-navigate-right" style="padding-bottom: 0px;"><div style="float:left;height:100%;width:60px"><img style="width:40px;border-radius:100px;" src="'+user_photo+'"></div><div style="height:20px;font-size: 14px;">'+data[i].createrName+'&nbsp;&nbsp;&nbsp;'+data[i].printDate.substring(0,10)+function(){

                                if(data[i].realPrcsId==1){
                                    return '<span style="float:right;color: blue;position: relative;bottom: -9px;">未提交</span>';
                                }else if(data[i].prFlag==1||data[i].prFlag==2){
                                    return '<span style="float:right;color:red;position: relative;bottom: -9px;">待审批</span>'
                                }

                            }()+'</div> <div style="height:30px;font-size: 14px;">' + data[i].runId + ' -- ' + data[i].title + '</div></a></li>';
                        }

                    }else{
                        for(var i=0;i<data.length;i++){//增加数据
                            var user_photo="";
                            if (data[i].avatar != 0 && data[i].avatar != 1 && data[i].avatar != '') {
                                user_photo = '/img/user/' + data[i].avatar;
                            } else {
                                if (data[i].sex == 1) {
                                    user_photo = '/img/user/girl.png';
                                }else{
                                    user_photo = '/img/user/boy.png';
                                }
                            }
                            var flowProcess_prcsId="";
                            if(data[i].flowProcess!=null){
                                flowProcess_prcsId=data[i].flowProcess.prcsId
                            }


                            li_inner+='<li class="pin mui-table-view-cell" opflag="'+data[i].opFlag+'" flowId="'+data[i].flowRun.flowId+'" prcsId="'+flowProcess_prcsId+'" flowStep="'+data[i].prcsId+'" runId="'+data[i].flowRun.runId+'"><a  href="javascript:;" class="mui-navigate-right" style="padding-bottom: 0px;"><div style="float:left;height:100%;width:60px"><img style="width:40px;border-radius:100px;" src="'+user_photo+'"></div><div style="height:20px;font-size: 14px;">'+data[i].userName+'&nbsp;&nbsp;&nbsp;'+data[i].createTime.substring(0,10)+function(){
                                if(data[i].prcsFlag<3){
                                    if(data[i].prcsId==1){
                                        return '<span style="float:right;color: blue;position: relative;bottom: -9px;">未提交</span>';
                                    }else if(data[i].prcsFlag==1||data[i].prcsFlag==2){
                                        return '<span style="float:right;color:red;position: relative;bottom: -9px;">待审批</span>'
                                    }
                                }else{
                                    return "";
                                }

                            }()+'</div> <div style="height:30px;font-size: 14px;">'+data[i].flowRun.runName+'</div></a></li>';

                        }

                    }
                    $(".list-ex").append(li_inner);
                    if(data.length<1){//当没有数据时
                        $(".nothing").remove();
                        $(".list-ex").append(li_inner1);
                    }
                }else if($('.nothing').length == 0){
                    $(".list-ex").append(li_inner1);
                }

                $('p').css({//多余的文字省略
                    'overflow': 'hidden',
                    'text-overflow':'ellipsis',
                    'white-space': 'nowrap',
                    'margin-right':'10px'
                })
                add();
            },

        })
    }
    function pullupRefresh() {
        sum = sum+1;
        var This=this;
        setTimeout(function(){
            data(add,sum,type_url);
            This.endPullupToRefresh(false);
        },500)
    }
    function add(){
        return	pageStart += 10
    }
    //进入默认显示的内容
    //var flag_type_lo = GetQueryString("flag"); //括号里放地址栏传参变量
    //workflowListChange('5');
    //workflowListChange(flag_type_lo);
    cornerGet();
    if(flag_type==1){
        workflowListChange2();
    }
    function workflowListChange2() {
        type_url = "/workflow/work/selectWork";
        //$('title').html('待办工作');

        $(".top-div-button").removeClass("top-div-button-visited");
        $("#top-div-button-"+flag_type).addClass("top-div-button-visited");
        loglist();
    }
    function workflowListChange(type_is) {
        //flag_type=type_is
        /*if(flag_type == 1){
            type_url = "/workflow/work/selectWork";
            //$('title').html('待办工作');
    
        }else if(flag_type==2){
            type_url = "/workflow/work/selectAll"
        }else if(flag_type==4){
            type_url = "/workflow/work/selectEndWord";
            //$('title').html('已办工作');
    
        }else if(flag_type==5){
            type_url = "/document/selWillDocSendOrReceive";
            //$('title').html('待办公文');
        }*/
        location.href="/ewx/index?flag="+type_is;
        /*$(".top-div-button").removeClass("top-div-button-visited");
        $("#top-div-button-"+flag_type).addClass("top-div-button-visited");
        loglist();*/
    }
    function jumpsrc(ul) {
        mui.openWindow({
            url: ul
        });
    }
    function check(name){
        if(name=='undefined'){
            return ''
        }else{
            return name;
        }
    }
    //搜索功能
    var u=navigator.userAgent;
    if(!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)){
        //获取IOS  eid
        $("#searchLog").blur(function(){
            loglist();
        })
    }else if(u.indexOf("Android")>-1||u.indexOf("Linux")>-1){
        //获取安卓  eid
        document.getElementById("searchLog").addEventListener("keydown",function(e){
            if(13 == e.keyCode){ //点击了“搜索”
                loglist();
                document.activeElement.blur();//隐藏软键盘
            }
        },false);
    }
    function loglist(){



        var data;
        if(flag_type==5){
            data = {
                "page":1,
                "pageSize":15,
                "useFlag":true,
                "title":'' //搜索的内容
                //"title":$("#searchLog").val() //搜索的内容
            };
        }else{
            data = {
                "page":1,
                "pageSize":15,
                "useFlag":true,
                "keyword":$("#searchLog").val() //搜索的内容
            };
        }

        mui.ajax({
            url: type_url,
            type: 'get',
            data:data,
            dataType:'json',
            success:function(res){
                var data;
                if(flag_type==5){
                    data=res.datas;
                }else{
                    data=res.obj;
                }
                var li_inner='';
                //<li class="nothing mui-table-view-cell">没有更多数据了</li>
                var li_inner1='';
                if(data.length>0){
                    if(flag_type==5){
                        for(var i=0;i<data.length;i++){//增加数据
                            var prcsName = "";
                            var user_photo="";
                            if (data[i].avatar != 0 && data[i].avatar != 1 && data[i].avatar != '') {
                                user_photo = '/img/user/' + data[i].avatar;
                            } else {
                                if (data[i].sex == 1) {
                                    user_photo = '/img/user/girl.png';
                                }else{
                                    user_photo = '/img/user/boy.png';
                                }
                            }



                            li_inner+='<li class="pin mui-table-view-cell" opflag="'+data[i].opFlag+'" flowId="'+data[i].flowId+'" tabId="'+data[i].id+'"  tableName="'+data[i].tableName+'" prcsId="'+data[i].realPrcsId+'" flowStep="'+data[i].step+'"  runId="'+data[i].runId+'"><a  href="javascript:;" class="mui-navigate-right" style="padding-bottom: 0px;"><div style="float:left;height:100%;width:60px"><img style="width:40px;border-radius:100px;" src="'+user_photo+'"></div><div style="height:20px;font-size: 14px;">'+data[i].createrName+'&nbsp;&nbsp;&nbsp;'+data[i].printDate.substring(0,10)+'</div> <div style="height:30px;font-size: 14px;">' + data[i].runId + ' -- ' + data[i].title +'</div></a></li>';


                        }

                    }else{
                        for(var i=0;i<data.length;i++){//增加数据
                            var user_photo="";
                            if (data[i].avatar != 0 && data[i].avatar != 1 && data[i].avatar != '') {
                                user_photo = '/img/user/' + data[i].avatar;
                            } else {
                                if (data[i].sex == 1) {
                                    user_photo = '/img/user/girl.png';
                                }else{
                                    user_photo = '/img/user/boy.png';
                                }
                            }
                            var flowProcess_prcsId="";
                            if(data[i].flowProcess!=null){
                                flowProcess_prcsId=data[i].flowProcess.prcsId
                            }

                            li_inner+='<li class="pin mui-table-view-cell" opflag="'+data[i].opFlag+'" flowId="'+data[i].flowRun.flowId+'" prcsId="'+flowProcess_prcsId+'" flowStep="'+data[i].prcsId+'" runId="'+data[i].flowRun.runId+'"><a  href="javascript:;" class="mui-navigate-right" style="padding-bottom: 0px;"><div style="float:left;height:100%;width:60px"><img style="width:40px;border-radius:100px;" src="'+user_photo+'"></div><div style="height:20px;font-size: 14px;">'+data[i].userName+'&nbsp;&nbsp;&nbsp;'+data[i].createTime.substring(0,10)+function(){

                                if(data[i].prcsId==1){
                                    return '<span style="float:right;color: blue;position: relative;bottom: -9px;">未提交</span>';
                                }else if(data[i].prcsFlag==1||data[i].prcsFlag==2){
                                    return '<span style="float:right;color:red;position: relative;bottom: -9px;">待审批</span>'
                                }

                            }()+'</div> <div style="height:30px;font-size: 14px;">'+data[i].flowRun.runName+'</div></a></li>';

                        }

                    }
                    $(".list-ex").append(li_inner);
                    if(data.length<1){//当没有数据时
                        $(".nothing").remove();
                        $(".list-ex").append(li_inner1);
                    }
                    $("#testUl").html(li_inner);
                }else{
                    //<li style="text-align:center" class="mui-table-view-cell">暂无数据</li>
                    $("#testUl").html('');
                }
            }
        });
    };
    /*获取角标内文本*/
    function cornerGet(){

        /*公文*/
        var document_url = "/document/selWillDocSendOrReceive?useFlag=true";
        /*工作*/
        var work_url = "/workflow/work/selectWork";


        $.ajax({
            url: document_url,
            type: 'get',
            data:{
                page: 1,
                pageSize:0,
                useFlag:true,
                title:''
            },
            dataType:'json',
            success:function(res){

                if(res.total>0){
                    $('#corner-5').css('display','');
                }
                if(res.total<99){
                    $('#corner-5').text(res.total);
                }

            }
        });
        $.ajax({
            url: work_url,
            type: 'get',
            data:{
                page: 1,
                pageSize:1,
                useFlag:true,
                title:''
            },
            dataType:'json',
            success:function(res){

                if(res.totleNum>0){
                    $('#corner-1').css('display','');
                }
                if(res.totleNum<99){
                    $('#corner-1').text(res.totleNum);
                }

            }
        });
    }
    mui("ul").on("tap","li",function(){
        var opflag=$(this).attr('opflag')
        var flowId=$(this).attr('flowId')
        var prcsId=$(this).attr('prcsId')
        var flowStep=$(this).attr('flowStep')
        var runId=$(this).attr('runId')
        var tabId=$(this).attr('tabId')
        var tableName=$(this).attr('tableName')
        if(opflag&&flowId) {

            if (flag_type == 1 || flag_type == 2) {
                if (flowId != 284 && flowId != 290) {
                    mui.openWindow({
                        url: '/workflow/work/workformh5?opflag=' + opflag + '&flowId=' + flowId + '&prcsId=' + prcsId + '&flowStep=' + flowStep + '&runId=' + runId + '&type=EWC'
                    });
                } else {
                layer.msg('手机端暂不支持，请前往PC端查看！');
                   
                }
            }
            if (flag_type == 4) {
                if (flowId != 284 && flowId != 290) {
                    mui.openWindow({
                        url: '/workflow/work/workformh5PreView?flowId=' + flowId + '&prcsId=&flowStep=&runId=' + runId + '&type=EWC'
                    });
                } else {
                   layer.msg('手机端暂不支持，请前往PC端查看！');
                }
            }
            if (flowId && flag_type == 5) {
                if (flowId != 284 && flowId != 290) {
                    mui.openWindow({
                        url: '/workflow/work/workformh5?flowId=' + flowId + '&flowStep=' + flowStep + '&prcsId=' + prcsId + '&runId=' + runId + '&opFlag=' + opflag + '&tableName=' + tableName + '&tabId=' + tabId + '&lang=zh_CN&opflag=' + opflag + '&type=EWC'

                    });
                } else {
                   layer.msg('手机端暂不支持，请前往PC端查看！');
                }

            }

        }
        });

</script>